<!DOCTYPE html>

<html>
  <head>

  </head>
  		<meta charset="utf-8"/>
		<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
	
		<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
		<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
		<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

		<link rel="stylesheet" type="text/css" href="css/comentario.css">
		
		<script src="js/bootbox.min.js"></script>
		<script src="js/jquery-visible.js"></script>
 <script >



//Matriz de posts, cada linha possui o id dos comentários
var post_array = [];
//Id do usuario que realizou o comentário
var comentario_user = [];
//Id do usuario que criou o post
var post_user = [];
//Flag para verificar se ainda pode carregar posts antigos
var is_there_more_post = true;


/*Definindo os intervalos de Updates e carregamento de comentários mais velhos*/
$(document).ready(function() {
	postLoad(); 
	setInterval(function () {comentarioLoad()}, 5000);
	setInterval(function () {newPosts()}, 5000);
	
	$(window).scroll(function() {
	
	  if( $(document).height() - ($(window).scrollTop() + $(window).height())  < 50 && is_there_more_post) {
		  morePost();
	  }
	 });
 
});

/*Sistema de envio e carregamento de 'laikes'*/
//Envio de 'Laike'
function laikeSend(id){

	id = id.replace ('nl', '');
	
	$.post ("laikar.php", {post_id: id}, function(data){
		if (data.trim() == '0')
			bootbox.alert("Faça login para laikar!", function() {
				window.location.assign("index.php");
			});
		else
			likesLoad()
	});
	
}

//Carregando novos 'laikes'
function likesLoad(){
	console.log ('likesload');
    for (post_idx in post_array){

        (function (post_idx){
 
			$.ajax({
				type: 'POST',
				url: 'getLaikes.php',
				data: { post_id: post_idx },
				dataType: 'json',
				cache: false,
				success: function (data) {
					console.log(data);
					title = "Clique aqui para laikar"
					if (data.flag == '1')
						title = "Clique aqui para deslaikar";
					document.getElementById("nl"+post_idx).innerHTML = "<span title='"+title+"' class='glyphicon glyphicon-thumbs-up' aria-hidden='true' > "+data.cnt+"</span>" ;

				},
				error: function(data){
						console.log('erro');
					}
			});
        })(post_idx);
       
    }
}

/*Sistema de Envio e carregamento de Posts*/
 
 
//Id do último post carregado
var last_id_post;

//Id do primeiro post
var first_id_post = 0;

//Criando novo post
function novoPost (nome, ramo, id, data, comentario, foto){

	var form = document.createElement ('form');
	
	form.id = id;
	form.innerHTML = '\
			 <div class="well well-sm" style="margin-bottom: 1px">\
	 	<div class="post">\
		 <div class="top">\
		 <i onClick="excluirPost(this)" class="glyphicon glyphicon-remove"></i>\
			<img  class="pull-left" src="../'+foto+'" >\
			<div>\
				<h4>'+nome+'</h4>\
				<h6>'+data+'-'+ramo+'</h6>\
			</div>\
		 </div>\
		<div class="content">'+comentario+'</div>\
		<div class="bot">\
			<div class="btn btn-success btn-sm" aria-label="Left Align" id="nl'+id+'" onClick="laikeSend(this.id)">\
					<span class="glyphicon glyphicon-thumbs-up" aria-hidden="true" > 0</span>\
			</div> \
			<div class="btn btn-sm" aria-label="Left Align" style="cursor:default">\
					<span class="glyphicon glyphicon-comment" aria-hidden="true" id="nc'+id+'"> 2</span>\
			</div> \
		</div>\
	 </div>\
	</div>\
	<div id="pc'+id+'"></div>\
	<div class="input-group add-on">\
	<input type="text" class="form-control" placeholder="Comentar..." name="comentario" autocomplete="off">\
	  <div class="input-group-btn">\
	  <button class="btn btn-default" type="submit" onClick="comentarioSend(this.form.id)"><i class="glyphicon glyphicon-share-alt"></i></button>\
	  </div>\
	</div>'
	document.getElementById('feed').appendChild(form);
	
	return form;
}

//Carregamento N posts mais novos ao carregar a página
function postLoad(){
	console.log('entrou: postLoad');
    $.ajax({ 
    	type: 'GET', 
    	url: '../WebService/getNPosts/5', 
    	data: { get_param: 'value' }, 
   		dataType:'json',
		cache: false,
        success: function (data) { 
            
        	 $('#feed').fadeOut(0);
        	 
        	 for (i = 0; i < data.posts.length; i++){

            	p = data.posts[i];
            	
            	if (i == 0)
            		first_id_post = p.post_id;
				
				post_array[p.post_id] = [];
				post_user[p.post_id] = p.usuario_id;
				
       			novoPost( p.nm_usuario, p.nm_ramo, p.post_id, p.data_hora, p.comentario, p.perfil_45);	

       			last_id_post = p.post_id;
			}
        	 comentarioLoad();
        	 
        	 likesLoad();
        	 
        	 $('#feed').fadeIn(400);
				
        }
    });
}

//Carregando posts mais antigos
function morePost(){
	console.log('entrou: morePost');
    $.ajax({ 
    	type: 'GET', 
    	url: '../WebService/getNPostsLessThanMid/3/'+last_id_post, 
    	data: { get_param: 'value' }, 
   		dataType:'json',
		cache: false,
        success: function (data) { 
			 if (data.posts.length == 0)
				 is_there_more_post = false;
        	 for (i = 0; i < data.posts.length; i++){
            	p = data.posts[i];
            		
				post_array[p.post_id] = [];
				post_user[p.post_id] = p.usuario_id;
				
       			novoPost( p.nm_usuario, p.nm_ramo, p.post_id, p.data_hora, p.comentario, p.perfil_45);	

       			

       			last_id_post = p.post_id;
			}
        	 comentarioLoad();
       
        }
    });

	
}
//Carregando posts mais novos
function newPosts(){
	console.log('entrou: newsPost');
    $.ajax({ 
    	type: 'GET', 
    	url: '../WebService/getAllPostsGreaterThanNid/'+first_id_post, 
    	data: { get_param: 'value' }, 
   		dataType:'json',
		cache: false,
        success: function (data) { 

        	 for (i = 0; i < data.posts.length; i++){
            	p = data.posts[i];
            		
				post_array[p.post_id] = [];
				post_user[p.post_id] = p.usuario_id;
       			form = novoPost( p.nm_usuario, p.nm_ramo, p.post_id, p.data_hora, p.comentario, p.perfil_45);	

       			document.getElementById('feed').insertBefore(form, document.getElementById('feed').firstChild);
       			$('#'+p.post_id).hide();
       			$('#'+p.post_id).fadeIn('slow');
				
       			first_id_post = p.post_id;

       			
			}
 			if (data.posts.length != 0)
        		comentarioLoad();
       
        }
    });
}


/*Sistema de Envio e carregamento de Comentários*/

//Enviando um novo comentário
function comentarioSend (id){
	
	console.log('entrou: comentarioSend');
	event.preventDefault();
	var data = $('#' + id).serializeArray();
	data.push ({name:'post_id', value: id});
		$.post ("comentar.php", data, function(data){
			if (data.trim() == '0')
				bootbox.alert("Faça login para comentar!", function() {
					window.location.assign("index.php");
				});
			else
				comentarioLoad();
		});
		document.getElementById(id).reset();
}

//Criando um novo comentário
function novoComentario (nome, comentario, data,  id_usuario, post_id, comentario_post_id, foto){

	var com = document.createElement("div");
	com.className = "comentario";
	com.id = 'c'+comentario_post_id;
	com.innerHTML = "<img class='pull-left'src='../"+foto+"'></img><strong>"+nome+"</strong> "+comentario+"<h6>"+data+"</h6><i onClick='excluirComentario(this.parentNode.id)'class='glyphicon glyphicon-remove'></i>";
	document.getElementById("pc"+post_id).appendChild(com);
	
}

//Carregando novos comentários
function comentarioLoad(){
	console.log('entrou: comentarioLoad');
    for (post_idx in post_array){

        (function (post_idx){
            
			$.ajax({
				type: 'GET',
				url: '../WebService/getComentariosById/'+post_idx,
				data: { get_param: 'value' },	
				dataType: 'json',
				cache: false,
				success: function (data) {
					 //Verificando se o comentário foi apagado
					 if (data.flag == '0'){
						 	post_array.splice (post_idx, 1);
						 	$('#'+post_idx).fadeOut(1000);
						 	return;
					 }

					 var comment_idx_new = 0;
					 var comment_idx_old = 0;
					 
					 document.getElementById("nc"+post_idx).innerHTML = " "+data.comentarios.length;
					 
					 while (comment_idx_new < data.comentarios.length){
						 
						c = data.comentarios[comment_idx_new];
						
						while (comment_idx_old < post_array[post_idx].length && post_array[post_idx][comment_idx_old] < c.comentario_post_id){
							comment_idx_old++;	
						}

						if (comment_idx_old < post_array[post_idx].length && post_array[post_idx][comment_idx_old] == c.comentario_post_id){
							 comment_idx_old++;
							 comment_idx_new++;
							 continue;
						}
						
					 		
					 	novoComentario( c.nm_usuario, c.comentario, c.data_hora,  c.id_usuario, post_idx, c.comentario_post_id, c.perfil_32);	
					 	comentario_user[c.comentario_post_id] = c.id_usuario;
						
						comment_idx_new++;
					 
					 }

					 post_array[post_idx] = [];
					 for (c in data.comentarios)
						 post_array[post_idx].push(data.comentarios[c].comentario_post_id);
					 
					 

				},
				error: function(data){
						console.log('erro');
					}
			});
        })(post_idx);
       
    }

}





/*Sistema para excluir um comentário*/
function excluirComentario(id){
	alert ('entrou');
	console.log('entrou: excluira');
	id = id.replace ('c', '');
	
	$.get ("getIdUsuario.php", function(data){
		alert(data);
		if (comentario_user[id] != data)
			bootbox.dialog({message: "Esse comentário está lhe incomodando?", 
				buttons:{
					"Não": {className: "btn-default btn-sm"},
					"Sim": {
							className: "btn-primary btn-sm",
							
							callback: function(){ $('#c'+id).fadeOut(1000);}
					}
					
				}
			}); 
		else
			bootbox.dialog({message: "Deseja excluir seu comentário?", 
				buttons:{
					"Não": {className: "btn-default btn-sm"},
					"Sim": {
							className: "btn-primary btn-sm",
							
							callback: function(){
								
								$('#c'+id).fadeOut(1000);
								$.param({comentario_post_id: id});
								$.post ("deletarComentario.php", {comentario_post_id: id});
								
							}
					}
					
				}
			}); 
	});
}

/*Sistema para excluir uma publicação*/

function excluirPost(sender){
	console.log('entrou: excluir-post');
	e = sender.parentNode.parentNode.parentNode.parentNode;
	id = e.getAttribute('id');

	$.get ("getIdUsuario.php", function(data){
		if (post_user[id] != data)
			bootbox.dialog({message: "Essa pubicação está lhe incomodando?", 
				buttons:{
					"Não": {className: "btn-default btn-sm"},
					"Sim": {
							className: "btn-primary btn-sm",
							
							callback: function(){ $('#'+id).fadeOut(1000);}
					}
					
				}
			}); 
		else
			bootbox.dialog({message: "Deseja excluir sua publicação?", 
				buttons:{
					"Não": {className: "btn-default btn-sm"},
					"Sim": {
							className: "btn-primary btn-sm",
							
							callback: function(){
								
								$('#'+id).fadeOut(1000);
								$.param({post_id: id});
								a = $.post ("deletarPost.php", {post_id: id});
								console.log(a);
							}
					}
					
				}
			}); 
	}); 
}



 	function clicou(){
 	 	
 		if($('#48').visible(true)) alert ('onScreen'); else alert ('no onsScreen');
 		
 		theParent = document.getElementById("feed");
		var theKid = document.createElement('h1');
		theKid.innerHTML = qtd++;

		theParent.appendChild(theKid);
		
		theParent.insertBefore(theKid, theParent.firstChild);

		
 	 }
  </script>
  
  <body>
  
  
			<button onClick="clicou()">hahaha</button>
			
			<div id="feed">
			

			  
		  </div>


         
  </body>
</html>